<!DOCTYPE html>
<html class="x-admin-sm">

<head>
    <meta charset="UTF-8">
    <title></title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi"/>
    <link rel="stylesheet" href="/web/res/css/xadmin.css">

    <script src="/web/res/lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="/web/res/js/xadmin.js"></script>


</head>

<body style="background-color: white;">
<div class="layui-fluid" id="orderEdit">
    <form class="layui-form layui-form-pane" id="formsubmit" style="width: 500px;margin:20px auto">
        <input type="hidden" id="id" name="id" value="${(feedback.id?c)!''}">

        <div class="layui-form-item">
            <label class="layui-form-label" style="width: 200px;">举报人id</label>
            <div class="layui-input-inline">
                <input type="text" id="userid" name="userid" required lay-verify="required" autocomplete="off"
                       class="layui-input" value="${feedback.userid!''}" disabled>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label" style="width: 200px;">举报人昵称</label>
            <div class="layui-input-inline">
                <input type="text" id="nick" name="nick" required lay-verify="required"
                       autocomplete="off"
                       class="layui-input" value="${feedback.nick!''}" disabled>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label" style="width: 200px;">举报人头像</label>
            <div class="layui-input-inline">

                <a href="javascript:void(0);" class="img_biges" title="${(feedback.pic)!''}">
                    <img src="${(feedback.pic)!''}" style=" width:100px;"/>

<!--                <img style="width: 100px;" src="${feedback.pic!''}" >-->
            </div>
        </div>
        <hr class="layui-bg-red">

        <div class="layui-form-item">
            <label class="layui-form-label" style="width: 200px;">被举报人id</label>
            <div class="layui-input-inline">
                <input type="text" id="bjbuserid" name="bjbuserid" required lay-verify="required" autocomplete="off"
                       class="layui-input" value="${feedback.bjbuserid!''}" disabled>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label" style="width: 200px;">被举报人昵称</label>
            <div class="layui-input-inline">
                <input type="text" id="bjbnick" name="bjbnick" required lay-verify="required"
                       autocomplete="off"
                       class="layui-input" value="${feedback.bjbnick!''}" disabled>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label" style="width: 200px;">被举报人头像</label>
            <div class="layui-input-inline">
                <a href="javascript:void(0);" class="img_biges" title="${(feedback.bjbpic)!''}">
                    <img src="${(feedback.bjbpic)!''}" style=" width:100px;"/>

<!--                    <img style="width: 100px;" src="${feedback.bjbpic!''}" >-->
            </div>
        </div>
        <hr class="layui-bg-red">


        <div class="layui-form-item">
            <label class="layui-form-label" style="width: 200px;">举报类型</label>
            <div class="layui-input-inline">
                <input class="layui-input" id="leixing" name="leixing" required lay-verify="required"
                       autocomplete="off"
                       value="<#if feedback.leixing==1>动态<#elseif feedback.leixing==2>房间<#elseif feedback.leixing==3>用户</#if>" disabled>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label" style="width: 200px;">涉及动态/房间id</label>
            <div class="layui-input-inline">
                <input type="text" id="bjbid" name="bjbid" required lay-verify="required"
                       autocomplete="off"
                       class="layui-input" value="${feedback.bjbid!''}" disabled>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label" style="width: 200px;">涉及的动态标题/房间名</label>
            <div class="layui-input-inline">
                <input type="text" id="nrbiaoti" name="nrbiaoti" required lay-verify="required"
                       autocomplete="off"
                       class="layui-input" value="${feedback.nrbiaoti!''}" disabled>
            </div>
        </div>

        <#if  (imgList?size>0) >
        <div class="layui-form-item">
            <label class="layui-form-label" style="width: 200px;">举报截图</label>
            <div class="layui-input-inline">

                  <#list imgList as img>
                      <img src="${img}" style="width: 150px">
                  </#list>
            </div>
        </div>
        </#if>

        <div class="layui-form-item">
            <label class="layui-form-label" style="width: 200px;">举报原因</label>
            <div class="layui-input-inline">
                <textarea type="text" style="height: 200px;" disabled id="message" name="message" required
                          lay-verify="required"
                          autocomplete="off" class="layui-input" readonly>${(feedback.message)!''}</textarea>
            </div>
        </div>


        <div class="layui-form-item">
            <label class="layui-form-label" style="width: 200px;">处理状态</label>
            <div class="layui-input-inline">
                <input type="text" id="state" name="state" required lay-verify="required"
                       autocomplete="off"
                       class="layui-input"
                       value="<#if feedback.state==1>未处理<#elseif feedback.state==2>已处理</#if>"
                       disabled>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label" style="width: 200px;">处理备注</label>
            <div class="layui-input-inline">
                <textarea type="text" style="height: 200px;" disabled id="clcontrent" name="clcontrent" required
                          lay-verify="required"
                          autocomplete="off" class="layui-input" readonly>${(feedback.clcontrent)!''}</textarea>
            </div>
        </div>
    </form>
</div>

<script>
    layui.use(['form','carousel'], function () {

        let $ = layui.$;
        var carousel = layui.carousel;
        // var form = layui.form;
        // form.render();

        // $.fn.extend({
        //     serializeObject: function () {
        //         var obj = {}; //声明一个对象
        //         $.each(this.serializeArray(), function (index, field) {
        //             obj[field.name] = field.value; //通过变量，将属性值，属性一起放到对象中
        //         })
        //         return obj;
        //     }
        // });


        //显示图片
        $('.img_biges').on('click', function () {
            const str = $(this).attr('title');
            swiperim(str);
        });

        // 逗号隔开的多图地址预览
        function swiperim(url) {
            var str = url.split(',')
            var htmlstr = '<div class="layui-carousel" id="test10" style="overflow:hidden"><div carousel-item>'
            str.forEach(e => {
                htmlstr += '<div style="line-height:377px;text-align:center;"><img src="' + e + '" style="max-width:100%;max-height:100%;background-size:contain;"></div>'
            })
            htmlstr += '</div></div>'
            layer.open({
                type: 1,
                title: false,
                closeBtn: 0,
                area: ['600px', '377px'],
                skin: 'layui-layer-nobg',
                shadeClose: true,
                content: htmlstr
            });
            //图片轮播
            carousel.render({
                elem: '#test10'
                , width: '600px'
                , height: '377px'
                , interval: 5000
            });
        }




    });


</script>
</body>

</html>
